<template>
  <div class="c-bg-sgray">
    <my-small-tabbar class="c-bg-white" id="tabhBar" :tabList="tabBList" :tabIndex="bigType" @changeTab="changebigType"></my-small-tabbar>
    <div class="c-mt12">
      <div v-if="bigType==1" class="c-bg-white c-flex-row c-pt15 c-pb20">
        <div class="c-flex-row c-content-auto c-mh24 c-hh48">
          <div v-for="(item) in tabList" :key="item.index" @click="changeType(item.index)" :class="type == item.index ? 'theme-bg-10 theme-bd1-20 theme-fc' : 'c-bg-f2 c-fc-gray'" class="c-boxSizing-b c-flex-row c-flex-center c-flex-shrink0 c-mr20 c-ww140 c-hh44 c-br30 c-fs24">{{item.title}}</div>
        </div>
      </div>
      <div v-if="bigType==2" class="c-bg-white c-flex-row c-pt15 c-pb20">
        <div class="c-flex-row c-content-auto c-mh24 c-hh48">
          <div v-for="(item) in learnTabList" :key="item.index" @click="changeType(item.index)" :class="type == item.index ? 'theme-bg-10 theme-bd1-20 theme-fc' : 'c-bg-f2 c-fc-gray'" class="c-boxSizing-b c-flex-row c-flex-center c-flex-shrink0 c-mr20 c-ww140 c-hh44 c-br30 c-fs24">{{item.title}}</div>
        </div>
      </div>
      <!-- <my-small-tabbar class="c-bg-white" id="tabhBar" :tabList="tabList" :tabIndex="type" @changeTab="changeType"></my-small-tabbar> -->
      <!-- 证书 -->
      <div>
        <div class="c-ph24 c-pb24 c-text-hidden">
          <div class="col" ref="col1">
            <div class="c-ww282 c-mt24 c-br16 c-bg-white" v-for="(item,index) in cercertificateList1" :key="index">
              <div class="c-ph12 c-pt12 ">
                <img @click="showCerSrc(item,index,1)" @load="loagCol" :src="$addXossFilter(item.thumbnail)" alt="" />
                <div class="c-fs24 c-fc-xblack c-textAlign-c c-mb10 c-text-ellipsis1 c-hh28 c-mt12" v-if="item.honorName">{{item.honorName}}</div>
                <div class="c-fs18 c-fc-sgray c-textAlign-c c-mt12 c-pb12">{{item.createdAt}}</div>
              </div>
              <div @click="showCeritem(item,index,1)" class="c-fs26 c-fc-orange c-textAlign-c c-pv12 c-bd-t1">更新数据</div>
            </div>
          </div>
          <div class="col c-ml26" ref="col2">
            <div class="c-ww282 c-mt24 c-br16 c-bg-white" v-for="(item,index) in cercertificateList2" :key="index">
              <div class="c-ph12 c-pt12 ">
                <img @click="showCerSrc(item,index,2)" @load="loagCol" :src="$addXossFilter(item.thumbnail)" alt="" />
                <div class="c-fs24 c-fc-xblack c-textAlign-c c-mb10 c-text-ellipsis1 c-hh28 c-mt12" v-if="item.honorName">{{item.honorName}}</div>
                <div class="c-fs18 c-fc-sgray c-textAlign-c c-mt12 c-pb12">{{item.createdAt}}</div>
              </div>
              <div @click="showCeritem(item,index,2)" class="c-fs26 c-fc-orange c-textAlign-c c-pv12 c-bd-t1">更新数据</div>
            </div>
          </div>
        </div>
        <loading-status-tem :dataStatus="dataStatus" noDataText="暂无证书"></loading-status-tem>
      </div>
      <div v-show="type==1&&bigType==1" @click="goOldList" class="old-into c-fs20 c-fc-xblack c-pv12 c-pl16 c-pf c-p-r0 c-p-b100 c-bg-white">查看旧证书<i class="iconfont icon c-fs18 c-pr6 c-ml6">&#xe635;</i></div>
    <!-- 打卡证书 -->
    </div>
    <certificate-com ref="certificateCom" :bigType="bigType" :prodId="prodId" :prodType="prodType" @updateImgeUrl="updateImgeUrl" @canvasOver="canvasOver" :showCertificate="showCertificate" :certInfo='certificateInfo' @closeCertificate='closeCertificate'>
    </certificate-com>
    <!-- 考试,AI证书 -->
    <examination-cer-new ref="examnationCerNew" :bigType="bigType" @updateImgeUrl="updateImgeUrl"></examination-cer-new>
    <!-- 测评证书 -->
    <exam-cer-new ref="examCerNew" :bigType="bigType" @updateImgeUrl="updateImgeUrl"></exam-cer-new>
    <!-- 训练营证书 -->
    <camp-certificate ref="campCerNew" :bigType="bigType" @updateImgeUrl="updateImgeUrl"></camp-certificate>
    <!-- 学习证书 -->
    <learn-cer ref="learnCerCom" :bigType="1" @updateImgeUrl="updateImgeUrl" :formOirn="1"></learn-cer>
    <!-- 入学证书 -->
    <enrol-cer ref="enrolcerCom" :bigType="2" @updateImgeUrl="updateImgeUrl" :formOirn="1"></enrol-cer>
    <!-- 荣誉证书 -->
    <honor-certificate ref="honorcerCom" @updateImgeUrl="updateImgeUrl" />
    <!-- <honor-cer :isReceivedStudy="1" ref="honorcerCom" :bigType="3" @updateImgeUrl="updateImgeUrl" :formOirn="1"></honor-cer> -->
  </div>
</template>

<script>
import loadingStatusTem from "@/components/templates/common/loadingStatusTem.vue";
import MySmallTabbar from "@/components/templates/common/MySmallTabbar.vue";
import { utilJs } from "@/utils/common.js";
import certificateCom from "@/components/homePage/clockIn/certificateCom.vue";
import examinationCerNew from "@/components/templates/examination/examinationCerNew.vue";
import examCerNew from "@/components/templates/examination/examCerNew.vue";
import campCertificate from "@/components/homePage/camp/campCertificate.vue";
import learnCer from "@/components/templates/learnAndachCer/learnCer.vue";
import enrolCer from "@/components/templates/learnAndachCer/enrolCer.vue";
import honorCertificate from "@/components/templates/learnAndachCer/honorCertificate.vue";
let pageIndex = 0;
let LIMIT = 10;
export default {
  name: "List",
  components: {
    loadingStatusTem,
    MySmallTabbar,
    certificateCom,
    examinationCerNew,
    examCerNew,
    campCertificate,
    learnCer,
    enrolCer,
    honorCertificate
  },
  props: [],
  beforeRouteEnter(to, from, next) {
    // 不！能！获取组件实例 `this`
    if (from.path.includes('/homePage/clockIn/myCertificate')) {
      next(vm => {
        vm.$store.commit('updateLoadingStatus', {
          isLoading: false
        });
        // 加上判断，否则返回分页会有问题
        if (vm.total * 1 == vm.to * 1) {
          vm.dataStatus = vm.total * 1 == 0 ? 'NO_DATA' : 'NO_MORE_DATA';
        } else {
          vm.dataStatus = 'HAS_MORE_DATA';
        }
        if (vm.achievementList.length == 0) {
          vm.initData();
        }
      });
    } else {
      next(vm => {
        vm.initData();
      });
    }
  },
  data() {
    return {
      theme: localStorage.getItem("colorName") ? localStorage.getItem("colorName") : "mb5_default",
      themeName: localStorage.getItem('themeName') ? localStorage.getItem('themeName') : 'mb5',
      companyAuth: JSON.parse(localStorage.getItem("companyAuth")),
      dataStatus: 'HAS_MORE_DATA',
      cercertificateList: [],
      type: 5,
      showCer: false,
      total: 0,
      to: 0,
      showCertificate:false,
      certificateInfo:{},
      tabBList:[
        {
          title: '学习证书',
          index: 1,
        }, {
          title: '入学证书',
          index: 2,
        }, {
          title: '荣誉证书',
          index: 3
        }
      ],
      tabList: [
        {
          title: '课程',
          index: 5
        },
        {
          title: '专栏',
          index: 7
        },
        {
          title: '训练营',
          index: 3
        },
        {
          title: '打卡',
          index: 2,
        },
        {
          title: '测评',
          index: 1,
        }
      ],
      learnTabList: [
        // 1)课程2) 专栏
        // 3) 知识餐4) 训营
        // 5)公开课6) 直播间7)小班课
        {
          title: '课程',
          index: 5
        },
        {
          title: '专栏',
          index: 7
        },
        {
          title: '知识套餐',
          index: 8
        },
        {
          title: '训练营',
          index: 3,
        },
        {
          title: '公开课',
          index: 9,
        },
        {
          title: '直播间',
          index: 10,
        },
        {
          title: '小班课',
          index: 11,
        },
      ],
      topicId:'',
      prodType:'',
      bigType:1,
      cercertificateList1:[],
      cercertificateList2:[],
      dataIndex:'',
      dataType:'',
      prodId:''
    };
  },
  created() {
    utilJs.appShare(this);
  },
  mounted() { },
  methods: {
    mountMenu(arg) {
        var temp = this.cercertificateList
        this.argIndex = arg || 0
        var refName = this.selectCol()
        if (temp.length > this.argIndex) {
          this[refName].push(this.cercertificateList[this.argIndex])
        }
    },
    loagCol() {
      this.$nextTick(() => {
        this.mountMenu(this.argIndex + 1)
      })
    },
    selectCol() {
        var getHeight = (ref) => {
            return this.$refs[ref].offsetHeight
        }
        var height1 = getHeight('col1')
        var height2 = getHeight('col2')
        console.log(height1, height2)
        switch (Math.min(height1, height2)) { // Math.min()方法返回参数中最小的值
            case height1:
            return 'cercertificateList1'
            case height2:
            return 'cercertificateList2'
        }
    },
    updateImgeUrl(url) {
      console.log(url)
      if (this.dataType == 1) {
        this.cercertificateList1[this.dataIndex].thumbnail = url
        this.cercertificateList1[this.dataIndex].image = url
      } else {
        this.cercertificateList2[this.dataIndex].thumbnail = url
        this.cercertificateList2[this.dataIndex].image = url
      }
    },
    showCerSrc(item, index, dataType) {
      if (!item.image) {
        this.showCeritem(item, index, dataType)
      } else {
        if (this.bigType == 1) {
          if (item.prodType == global.ckFrom.testpPaper || item.prodType == global.ckFrom.voiceTest) {
            this.$nextTick(() => {
              this.$refs.examnationCerNew.showCerImage(item.image, item.shapeType)
            });
          } else if (item.prodType == global.ckFrom.exam) {
            this.$nextTick(() => {
              this.$refs.examCerNew.showCerImage(item.image, item.shapeType)
            });
          } else if (item.prodType == global.ckFrom.clockIn) {
            this.$nextTick(() => {
              this.$refs.certificateCom.showCerImage(item.image, item.shapeType)
            });
          } else if (item.prodType == global.ckFrom.camp) {
            this.$nextTick(() => {
              this.$refs.campCerNew.showCerImage(item.image, item.shapeType)
            });
          } else if (item.prodType == global.ckFrom.video || item.prodType == global.ckFrom.imgText || item.prodType == global.ckFrom.voice || item.prodType == global.ckFrom.column) {
            this.$nextTick(() => {
              this.$refs.learnCerCom.showCerImage(item.image, item.shapeType)
            });
          }
        } else if (this.bigType == 2) {
          this.$refs.enrolcerCom.showCerImage(item.image, item.shapeType)
        } else if (this.bigType == 3) {
          this.$refs.honorcerCom.public_showImg(item.image, item.shapeType == 1 ? 'VER' : 'HOR');
        }
      }
    },
    showCeritem(item, index, dataType) {
      this.dataIndex = index,
      this.dataType = dataType
      this.prodId = item.prodId
      if (this.bigType == 1) {
        if (this.type == 2) {
          this.prodType = global.ckFrom.clockIn
          this.clockInC(item)
        } else if (this.type == 1) {
          this.prodType = global.ckFrom.exam
        } else if (this.type == 3) {
          this.prodType = global.ckFrom.camp
        } else if (this.type == 5) {
          this.prodType = global.ckFrom.course
        } else if (this.type == 7) {
          this.prodType = global.ckFrom.column
        }
        if (this.type == 1 || this.type == 3 || this.type == 5 || this.type == 7) {
          this.enlarge(item)
        }
      } else if (this.bigType == 2) {
        this.$refs.enrolcerCom.drawNow('', this.prodId, item.prodType)
      } else if (this.bigType == 3) {
        this.$refs.honorcerCom.public_open({id:item.id, cardId:item.cardId})
      }
    },
    goOldList() {
      this.$routerGo(this, "push", {
        path: "/member/myAchievement/List",
      });
    },
    closeCertificate() {
      this.showCertificate = false;
    },
    changebigType(type) {
      if (type == this.bigType) {
        return;
      }
      this.bigType = type;
        this.initData()
      // }
    },
    changeType(type) {
      if (type == this.type) {
        return;
      }
      if (type == 1) {
        this.prodType = global.ckFrom.exam
      } else if (type == 2) {
        this.prodType = global.ckFrom.clockIn
      } else if (type == 3) {
        this.prodType = global.ckFrom.camp
      } else if (type == 5) {
        this.prodType = global.ckFrom.course
      } else if (type == 7) {
        this.prodType = global.ckFrom.column
      } else if (type == 8) {
        this.prodType = global.ckFrom.package
      } else if (type == 9) {
        this.prodType = global.ckFrom.live
      } else if (type == 10) {
        this.prodType = global.ckFrom.personalLive
      } else if (type == 11) {
        this.prodType = global.ckFrom.privateClass
      }
      this.type = type
      pageIndex = 1;
      this.cercertificateList = [];
      this.campList = [];
      this.getCercertificateList();
    },
    // 证书
    getCercertificateList() {
      if (this.dataStatus == 'LOADING') {
        return;
      }
      this.dataStatus = 'LOADING';
      if (this.bigType == 3) {
        this.prodType = ''
      }
      utilJs.getMethod(
        global.apiurl + "Certificate/achievementList?page=" + pageIndex + '&LIMIT=' + LIMIT + '&prodType=' + this.prodType + '&type=' + this.bigType,
        res => {
          if (pageIndex == 1) {
            this.cercertificateList1 = []
            this.cercertificateList2 = []
          }
            this.cercertificateList = res.data;
          // }
          if (res.data && (res.data < 10)) {
            this.dataStatus = pageIndex == 1 && res.data.length == 0 ? 'NO_DATA' : 'NO_MORE_DATA';
          } else {
            this.dataStatus = 'HAS_MORE_DATA';
            pageIndex++;
          }
          this.$nextTick(() => {
          this.mountMenu()})
        },
        failRes => {
          this.dataStatus = 'DATA_ERROR';
        }
      );
    },
    canvasOver() {
      this.$loading.hide();
    },
    enlarge(item) {
      if (item.prodType == global.ckFrom.testpPaper || item.prodType == global.ckFrom.voiceTest) {
        this.$nextTick(() => {
          this.$refs.examnationCerNew.drawNow(item.fromTopicId, item.prodId, item.prodType)
        });
      } else if (item.prodType == global.ckFrom.exam) {
        this.$nextTick(() => {
          this.$refs.examCerNew.drawNow(item.fromTopicId, item.prodId, item.prodType)
        });
      } else if (item.prodType == global.ckFrom.video || item.prodType == global.ckFrom.imgText || item.prodType == global.ckFrom.voice || item.prodType == global.ckFrom.column) {
        this.$nextTick(() => {
          this.$refs.learnCerCom.drawNow(item.fromTopicId, item.prodId, item.prodType)
        });
      } else {
        this.$nextTick(() => {
          this.$refs.campCerNew.getMyCert(item.fromTopicId, item.prodId, item.prodType)
        });
      }
    },
    clockInC(item) {
      this.$loading.show({
        text: "证书生成中"
      });
      //获取证书信息
      utilJs.getMethod(
        // /api/Certificate/cardShow?
        `${global.apiurl}Certificate/cardShow?prodType=${item.prodType}&prodId=${item.prodId}&type=1&day=${item.startTime}`,
        (res) => {
          let titleArr = [];
          let titleName = res.name ? res.name : res.prodName;
          let firstTitle = titleName.substring(0, 13);
          let sencendTitle = titleName.substring(13, 26);
          firstTitle && titleArr.push(firstTitle);
          sencendTitle && titleArr.push(sencendTitle);
          let cardCover = res.image.includes("?")
            ? `${res.image}&${+new Date()}`
            : `${res.image}?${+new Date()}`;
          let headimgurl = res.headimgurl.includes("?")
            ? `${res.headimgurl}&${+new Date()}`
            : `${res.headimgurl}?${+new Date()}`;
            let homeQrcode = res.signBaseInfo.homeQrcode.includes("?")
            ? `${res.signBaseInfo.homeQrcode}&${+new Date()}`
            : `${res.signBaseInfo.homeQrcode}?${+new Date()}`;
          let qrCodeUrl = res.signBaseInfo.qrCodeUrl.includes("?")
            ? `${res.signBaseInfo.qrCodeUrl}&${+new Date()}`
            : `${res.signBaseInfo.qrCodeUrl}?${+new Date()}`;
          let continuoueDay = null;
          let defineShowContent = res.defineShowContent
          if (res.signBaseInfo.type == 3 && defineShowContent.includes(8)) {
            //解锁课时
            continuoueDay = res.signBaseInfo.hasSignDay;
          } else if (res.signBaseInfo.type != 3 && defineShowContent.includes(9)) {
            continuoueDay = res.signBaseInfo.continueDay;
          }
          let signDay = null;
          if (res.signBaseInfo.type == 3 && defineShowContent.includes(12)) {
            //通关天数
            signDay = res.signBaseInfo.spendDays;
          } else if (res.signBaseInfo.type != 3 && defineShowContent.includes(8)) {
            signDay = res.signBaseInfo.hasSignDay;
          }
          let qrcodeUrlSelf = "";
          let qrCodeText = "长按识别二维码加入打卡"
          if (res.redirectTo == 1) {
            qrcodeUrlSelf = qrCodeUrl
          } else if (res.redirectTo == 2) {
            qrcodeUrlSelf = homeQrcode;
          } else if (res.redirectTo == 3) {
            qrcodeUrlSelf = res.customizeQrCode.img;
          }
          qrCodeText = res.qrCodeText ? res.qrCodeText : qrCodeText
          let info = {
            isDefaultWord: res.contentType,
            word: res.content || [],
            signDay: signDay,
            continuoueDay: continuoueDay,
            good: defineShowContent.includes(10) ? res.signBaseInfo.hotNum : null,
            like: defineShowContent.includes(11) ? res.signBaseInfo.zanNum : null,
            titleArr: titleArr,
            title:res.title,
            nickname: res.nickname,
            realName: res.realName,
            cardCover: cardCover,
            headimgurl:
              headimgurl || require("../../../assets/defult_head.png"),
            qrcodeImg: qrcodeUrlSelf,
            // 通关天数||打卡天数
             iconSign:
              res.signBaseInfo.type == 2
                ? 'https://ck-bkt-knowledge-payment.oss-cn-hangzhou.aliyuncs.com/admin/material/9_material_admin/image/assets/i/wap/clockIn/icon_num.png'
                : res.signBaseInfo.type == 3
                  ? 'https://ck-bkt-knowledge-payment.oss-cn-hangzhou.aliyuncs.com/admin/material/9_material_admin/image/assets/i/wap/clockIn/icon_level_day.png'
                  : 'https://ck-bkt-knowledge-payment.oss-cn-hangzhou.aliyuncs.com/admin/material/9_material_admin/image/assets/i/wap/clockIn/icon_day.png',
            iconContinue:
              res.signBaseInfo.type == 3
                ? 'https://ck-bkt-knowledge-payment.oss-cn-hangzhou.aliyuncs.com/admin/material/9_material_admin/image/assets/i/wap/clockIn/icon_level_course.png'
                : 'https://ck-bkt-knowledge-payment.oss-cn-hangzhou.aliyuncs.com/admin/material/9_material_admin/image/assets/i/wap/clockIn/icon_continue.png',
            iconGood: 'https://ck-bkt-knowledge-payment.oss-cn-hangzhou.aliyuncs.com/admin/material/9_material_admin/image/assets/i/wap/clockIn/icon_good.png',
            iconLike: 'https://ck-bkt-knowledge-payment.oss-cn-hangzhou.aliyuncs.com/admin/material/9_material_admin/image/assets/i/wap/clockIn/icon_like.png',
            customizeControl:res.customizeControl,
            certificateType:res.certificateType,
            customizeImage:res.customizeImage,
            avatarShowType:res.nameTypeShow,
            shareDesc:res.shareDesc,
            enableAvatarShow:res.enableAvatarShow,
            enableShowQrCode:res.enableShowQrCode,
            qrCodeText:qrCodeText,
            createdAt:res.createdAt,
            enableInstitution:res.enableInstitution, //是否展示发证机构：1=展示；0=隐藏
            institutionName:res.institutionName, //机构名称
            enableGrantTime:res.enableGrantTime, //是否展示发证时间  1=展示；0=隐藏
            enableNumber:res.enableNumber, //是否展示证书编号 1=展示；0=隐藏
            number:res.number, //起始编号
            enableStamp:res.enableStamp, //是否展示章戳  1=展示；2=自定义; 0=隐藏
            stampImg:res.stampImg, //章戳自定义图片
            shapeType:res.shapeType,
            id:res.cardLogId
          };
          this.certificateInfo = info;
          console.log(this.certificateInfo)
          this.showCertificate = true;
        }
      );
    },
    //分享
    wechatShare: function () {
      let shareUrl =
        window.location.href.split("#")[0] +
        "#" +
        this.$route.path +
        "?refereeId=" +
        localStorage.getItem("userId");
      utilJs.wechatConfig(shareUrl, "我的成就", "", "", function () { });
    },
    //手机端分享
    appShare: function () {
      let shareUrl =
        window.location.href.split("#")[0] +
        "#" +
        this.$route.path +
        "?refereeId=" +
        localStorage.getItem("userId");
      utilJs.appShareTrue("我的成就", "", shareUrl, "");
    },
    windowScrollFunction() {
      utilJs.handleLoading(() => {
        if (this.dataStatus == 'HAS_MORE_DATA' && this.cercertificateList.length > 0) {
          this.getCercertificateList();
        }
      });
    },
    initData() {
      pageIndex = 1;
      this.dataStatus = 'HAS_MORE_DATA';
      this.achievementList = [];
      this.cercertificateList = [];
      this.companyAuth = JSON.parse(localStorage.getItem("companyAuth"));
      this.tabList = [];
      this.learnTabList = [];
      this.type = 5
      let ts = {
          title: '课程',
          index: 5
        }
      this.tabList.push(ts);
      this.learnTabList.push(ts);
      if (this.companyAuth.enableColumnModule == 1) {
        let ts = {
          title: '专栏',
          index: 7
        };
        this.tabList.push(ts);
        this.learnTabList.push(ts);
      }
      if (this.companyAuth.enableComboModule == 1) {
        let ts = {
          title: '知识套餐',
          index: 8
        };
        this.learnTabList.push(ts);
      }
      if (this.companyAuth.enableTrainingModule == 1) {
        let ts = {
          title: '训练营',
          index: 3
        };
        this.tabList.push(ts);
        this.learnTabList.push(ts);
      }
      if (this.companyAuth.enableTeleviseLive == 1) {
        let ts = {
          title: '公开课',
          index: 9
        };
        this.learnTabList.push(ts);
      }
      if (this.companyAuth.enableLivePersonalModule == 1) {
        let ts = {
          title: '直播间',
          index: 10
        };
        this.learnTabList.push(ts);
      }
      if (this.companyAuth.enableLivePrivateClass == 1) {
        let ts = {
          title: '小班课',
          index: 11
        };
        this.learnTabList.push(ts);
      }
      if (this.companyAuth.enableSignCardModule == 1) {
        let ts = {
          title: '打卡',
          index: 2,
        };

        this.tabList.push(ts);
      }
      if (this.companyAuth.enableExamModule == 1) {
        let ts = {
          title: '测评',
          index: 1,
        };
        this.tabList.push(ts);
      }
      this.prodType = global.ckFrom.course
      this.getCercertificateList();
      // switch (this.type) {
      //   case 5:

      //     return;
      //   case 7:
      //     this.prodType = global.ckFrom.column
      //     this.getCercertificateList();
      //     return;
      //   case 3:
      //     this.prodType = global.ckFrom.camp
      //     this.getCercertificateList();
      //     return;
      //   case 2:
      //     this.prodType = global.ckFrom.clockIn
      //     this.getCercertificateList();
      //     return;
      //   case 1:
      //     this.prodType = global.ckFrom.exam
      //     this.getCercertificateList();
      //     return;
      // }
    }
  },
  activated() {
    setDocumentTitle("我的成就");// eslint-disable-line
    this.wechatShare();
    window.addEventListener('scroll', this.windowScrollFunction);
    this.bigType = this.$route.query.bigType || 1//改动测试
  },
  deactivated() {
    this.dataStatus = 'NO_MORE_DATA';
    window.removeEventListener('scroll', this.windowScrollFunction);
  }
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->

<style scoped>
.bg-orange-linear-gradient {
  background: linear-gradient(#ff8920, #ffc26b); /* 标准的语法 */
  box-shadow: 0px 2px 8px 0px rgba(255, 141, 37, 0.5);
  border-radius: 50%;
}
.old-into{
  border-radius: 5rem 0 0 5rem
}
.filterBlur{
  filter: blur(1.5px)
}
.col{
    float: left;
}
</style>
